
.middle2{
    width: 70%;
    margin: 2rem auto 0 auto;
}
#middle2-title{
    width: 70%;
    margin: 5rem auto 0 auto;
    text-align: center;
    font: 400 2.5rem "微软雅黑";
}
.middle2 #classify-container{
    display: flex;
    justify-content: end;
    width: 100%;
}
.middle2 .classify-box{
    display: flex;
    width: 22rem;
    height: calc(3rem + 2px);
    margin-top: 1rem;
    margin-right: 0px;
    border-bottom: 2px solid #a4a4a4;
}

.middle2 .classify-box span{
    display: inline-block;
    width: 5.5rem;
    height:3rem;
    text-align: center;
    color: #a4a4a4;
    /* border-bottom: 2px solid #a4a4a4; */
    margin-right: 0px;
    cursor: pointer;
}
.middle2 .classify-box .current-type{
    font: 600 1rem "微软雅黑";
    border-bottom: 4px solid black;
    color: black;
}
.middle2 .classify-box span:hover{
    font: 600 1rem "微软雅黑";
    border-bottom: 4px solid black;
    color: black;
}

.middle2 .class{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 2rem;
}

.middle2 .class img{
    height: 5rem;
    width: 5rem;
    border-radius: 50%;
}

.middle2 .class div{
    margin-left: 2rem;
}
.middle2 .class h2{
    font: 400 2rem "微软雅黑";
    margin-bottom: 1rem;
}

.middle2 .class span{
    display: inline-block;
    font: 400 0.8rem "微软雅黑";
    border-radius: 1rem;
    color: white;
    padding: 2px 12px;
    margin:1rem 0.5rem 0 0;
}
.middle2 .label-1{
    background-color: #a9beff;
}
.middle2 .label-2{
    background-color: #317034;
}
.middle2 .label-3{
background-color: #345170;
}